import React from "react";

interface SoftHaloProps {
  size?: number;
  color?: string;
  blur?: number;
}

export default function SoftHalo({
  size = 300,
  color = "#5732ff",
  blur = 80,
}: SoftHaloProps) {
  return (
    <div
      style={{
        width: size,
        height: size,
        borderRadius: "50%", // 圆形容器
        // 径向渐变：中心颜色深，边缘透明
        background: `radial-gradient(circle at center, ${color} 0%, rgba(0,0,0,0) 60%)`,
        // 高斯模糊，强化自然扩散
        backdropFilter: `blur(${blur}px)`, 
        WebkitBackdropFilter: `blur(${blur}px)`, // 兼容 Safari
      }}
    />
  );
}